/** 
 * Project Name:sys-portal-Extjs 
 * File Name:Button.js 
 * Package Name: 
 * Author : 吴Yuan|小森森
 * Date:2019年1月17日上午11:54:49 
 * Copyright (c) 2019, 15909910367@163.com All Rights Reserved. 
 * 
 */
Ext.define('Jason.view.example.form.basic.Button', {
    extend: 'Ext.panel.Panel',
    requires: [
        'Wys.button.DefaultBtn',
        'Ext.panel.Panel'
    ],
    items: [
        {
            xtype: 'container',
            margin: 7,
            defaults: { margin: 3 },
            items: [
                { xtype: 'label', text: '默认按钮' },
                { xtype: 'defaultBtn', text: '默认按钮', ui: 'btn-default' },
                { xtype: 'defaultBtn', text: '主要按钮', ui: 'btn-primary' },
                { xtype: 'defaultBtn', text: '成功按钮', ui: 'btn-success' },
                { xtype: 'defaultBtn', text: '消息按钮', ui: 'btn-info' },
                { xtype: 'defaultBtn', text: '警告按钮', ui: 'btn-warning' },
                { xtype: 'defaultBtn', text: '危险按钮', ui: 'btn-danger' }
            ]
        },
        {
            xtype: 'container',
            margin: 7,
            defaults: { margin: 3 },
            items: [
                { xtype: 'label', text: '朴素按钮' },
                { xtype: 'defaultBtn', text: '默认按钮', ui: 'btn-default-plain' },
                { xtype: 'defaultBtn', text: '主要按钮', ui: 'btn-primary-plain' },
                { xtype: 'defaultBtn', text: '成功按钮', ui: 'btn-success-plain' },
                { xtype: 'defaultBtn', text: '消息按钮', ui: 'btn-info-plain' },
                { xtype: 'defaultBtn', text: '警告按钮', ui: 'btn-warning-plain' },
                { xtype: 'defaultBtn', text: '危险按钮', ui: 'btn-danger-plain' }
            ]
        },
        {
            xtype: 'container',
            margin: 7,
            defaults: { margin: 3 },
            items: [
                { xtype: 'label', text: '圆角按钮' },
                { xtype: 'defaultBtn', text: '默认按钮', ui: 'btn-default-round' },
                { xtype: 'defaultBtn', text: '主要按钮', ui: 'btn-primary-round' },
                { xtype: 'defaultBtn', text: '成功按钮', ui: 'btn-success-round' },
                { xtype: 'defaultBtn', text: '消息按钮', ui: 'btn-info-round' },
                { xtype: 'defaultBtn', text: '警告按钮', ui: 'btn-warning-round' },
                { xtype: 'defaultBtn', text: '危险按钮', ui: 'btn-danger-round' }
            ]
        },
        {
            xtype: 'container',
            margin: 7,
            defaults: { margin: 3 },
            items: [
                { xtype: 'label', text: '图标按钮' },
                { xtype: 'defaultBtn', iconCls: 'fa fa-users', ui: 'btn-default-circle' },
                { xtype: 'defaultBtn', iconCls: 'fa fa-users', ui: 'btn-primary-circle' },
                { xtype: 'defaultBtn', iconCls: 'fa fa-users', ui: 'btn-success-circle' },
                { xtype: 'defaultBtn', iconCls: 'fa fa-users', ui: 'btn-info-circle' },
                { xtype: 'defaultBtn', iconCls: 'fa fa-users', ui: 'btn-warning-circle' },
                { xtype: 'defaultBtn', iconCls: 'fa fa-users', ui: 'btn-danger-circle' }
            ]
        },
        {
            xtype: 'codeField',
            readOnly: true,
            width: '97%',
            margin: '0px 7px',
            value: "使用方法： \r\n 1、在需要使用的组件定义或者页面类中使用 requires:[\"Wys.button.DefaultBtn\"] 或 直接使用Ext自己的按钮Ext.requires(\"Ext.button.Button\") 将自定义组件引入 \r\n 2、将组件加入到要显示的容其中.如(items:[{xtype:'defaultBtn',ui:....略}]),即可完成调用\r\n 3、样式解释（直接给组件ui即可）\r\n 默认样式  \r\n   btn-default 默认按钮 \r\n   btn-success 成功按钮 \r\n   btn-info 消息按钮  \r\n   btn-warning 警告按钮 \r\n   btn-danger 危险按钮\r\n 朴素样式   \r\n   btn-default-plain 默认按钮 \r\n   btn-success-plain 成功按钮 \r\n   btn-info-plain 消息按钮  \r\n   btn-warning-plain 警告按钮 \r\n   btn-danger-plain 危险按钮\r\n 圆角样式   \r\n   btn-default-round 默认按钮 \r\n   btn-success-round 成功按钮 \r\n   btn-info-round 消息按钮  \r\n   btn-warning-round 警告按钮 \r\n   btn-danger-round 危险按钮"
        }
    ]
});